<template>
  <div>
    <div class="xh">
      <label>
        <i class="el-icon-user-solid"></i
        ><input
          v-model="studentId"
          type="text"
          placeholder="请输入您的学号"
          @focus="isKeybard = true"
        />
      </label>
      <br />
      <button :disabled="verifyDisab" @click="btnStu">身 份 验 证</button>
    </div>
    <!-- 弹窗 -->
    <alert :warndata="warndata" />
    <!-- 提示开始培训  -->
    <el-dialog title="提示" :visible.sync="pxVisible" width="50%" center>
      <div>
        您的姓名是：<span style="color:rgb(244, 118, 25)">{{ name }}</span>
        , 是否开始培训？
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="(pxVisible = false), (verifyDisab = false)"
          >取 消</el-button
        >
        <el-button type="primary" @click="gamepx">开 始</el-button>
      </span>
    </el-dialog>

    <!-- 提示更换机器 -->
    <el-dialog title="提示" :visible.sync="changepxVisible" width="50%" center>
      <div>
        姓名：<span style="color:rgb(244, 118, 25)">{{ name }} </span>,
        您在：<span style="color:rgb(244, 118, 25)">{{
          oldEquipmentName
        }}</span>
        已存在培训, 开始时间为
        <span style="color:rgb(244, 118, 25)">{{ startTime }}</span>
        是否更换设备重新开始培训？
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="changepxVisible = false">取 消</el-button>
        <el-button type="primary" @click="changepx">确 定</el-button>
      </span>
    </el-dialog>
    <keybard v-show="isKeybard" @changeKey="changeKey"></keybard>
  </div>
</template>

<script>
import keybard from "@/components/keybard";
import Alert from "@/components/Alert.vue";

export default {
  name: "Xverify",
  components: { keybard, Alert },
  data() {
    return {
      name: "",
      pxVisible: false,
      isKeybard: false, // 显示输入键盘
      changepxVisible: false,
      startTime: "",
      studentId: "",
      verifyDisab: false,
      oldEquipmentName: "", //原设备名称
      trainModeId: "",
      equipmentIdOld: "", // 原设备id
      warndata: [],
    };
  },
  mounted() {
    document.querySelector("body").style.backgroundColor = "#f3ffff";
    this.ctimev= setInterval(() => {
        this.$parent.queryInfor();
    }, 1000*60*3);
  },
  methods: {
    
    // 输入学号
    changeKey(val) {
      Number.isFinite(val)
        ? (this.studentId = this.studentId + val + "")
        : val == "delete"
        ? (this.studentId = this.studentId.slice(0, this.studentId.length - 1))
        : ( this.studentId ?this.btnStu():'', (this.isKeybard = false));
    },
    // 发起学号验证
    btnStu() {
      this.studentId == ""
        ? (this.warndata = [1, "请输入学号", 1000])
        : (() => {
            this.verifyDisab = true;
            this.$axios
              .get(
                `platform/trainMode/selectStudent?studentId=${this.studentId}`
              )
              .then((res) => {
                console.log(res);
                if (res.data.data) {
                  let ldata = JSON.parse(res.data.data);
                  this.name = ldata.studentName;
                  this.pxVisible = true;
                  this.isKeybard = false;
                  this.$store.commit("setStudentId", ldata.studentId);
                  this.$store.commit("setStudentIdCard", ldata.studentIdCard);
                } else {
                  this.studentId = "";
                  this.warndata = [1, "您输入的学号有误", 2000];
                  this.verifyDisab = false;
                }
              })
              .catch((err) => {
                console.log(err);
                this.warndata = [1, "网络错误", 2500];
                this.verifyDisab = false;
              });
          })();
    },
    // 开始培训
    gamepx() {
      this.pxVisible = false;
      this.$axios
        .post(
          `platform/trainMode/startTrainMode?studentId=${this.studentId}&equipmentId=${this.$store.state.equipmentId}`
        )
        .then((res) => {
          console.log(res);
          if (res.data.msg == "已存在培训") {
            let ndata = JSON.parse(res.data.data);
            this.startTime = ndata.startTime;
            // this.$store.commit("setEquipmentName", ndata.equipmentName);
            this.oldEquipmentName = ndata.equipmentName;
            // this.$store.commit("setStudentName", ndata.studentName);
            this.name = ndata.studentName;
            this.trainModeId = ndata.trainModeId;
            this.equipmentIdOld = ndata.equipmentId;
            this.changepxVisible = true;
          } else if (res.data.result_code == 500) {
            this.warndata = [1, "没有开始的培训", 2500];
          } else {
            this.$store.commit("setStudentName", this.name);
            // this.$refs.count.iscount = true;
            this.warndata = [2, "开始培训", 2500];
            this.$router.push("/train");
            this.$store.commit("setKsksDisable", true);
          }
        })
        .catch(() => {
          this.warndata = [1, "网络错误", 2560];
          this.verifyDisab = false;
        });
    },
    // 更换机器开始培训
    changepx() {
      this.changepxVisible = false;
      this.$axios
        .post(
          `platform/trainMode/restartTrainMode?studentId=${this.studentId}&equipmentIdNow=${this.$store.state.equipmentId}&trainModeId=${this.trainModeId}&equipmentIdOld=${this.equipmentIdOld}`
        )
        .then((res) => {
          console.log(res);
          //   this.$refs.count.iscount = true;
          this.warndata = [2, "开始培训", 2500];
          this.$store.commit("setStudentName", this.name);
          this.$store.commit("ksksDisable", true);
          this.$router.push("/train");
        })
        .catch(() => {
          this.warndata = [1, "网络错误", 2560];
          this.verifyDisab = false;
        });
    },
  },
};
</script>
